<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>API调试页面</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div class="container mt-4">
        <h1>API调试页面</h1>
        
        <div class="row">
            <div class="col-md-6">
                <div class="card">
                    <div class="card-header">
                        <h5>认证测试</h5>
                    </div>
                    <div class="card-body">
                        <div class="mb-3">
                            <label class="form-label">用户名</label>
                            <input type="text" class="form-control" id="username" value="admin">
                        </div>
                        <div class="mb-3">
                            <label class="form-label">密码</label>
                            <input type="password" class="form-control" id="password" value="admin123">
                        </div>
                        <button class="btn btn-primary" onclick="testLogin()">登录测试</button>
                        <button class="btn btn-secondary" onclick="checkToken()">检查Token</button>
                    </div>
                </div>
            </div>
            
            <div class="col-md-6">
                <div class="card">
                    <div class="card-header">
                        <h5>API测试</h5>
                    </div>
                    <div class="card-body">
                        <button class="btn btn-info mb-2" onclick="testGetClues()">获取线索列表</button><br>
                        <button class="btn btn-info mb-2" onclick="testGetClueDetail(1)">获取线索详情(ID=1)</button><br>
                        <button class="btn btn-info mb-2" onclick="testGetHistory(1)">获取处理历史(ID=1)</button><br>
                        <button class="btn btn-info mb-2" onclick="testExport()">测试导出</button><br>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="row mt-4">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <h5>调试输出</h5>
                    </div>
                    <div class="card-body">
                        <pre id="debugOutput" style="max-height: 400px; overflow-y: auto; background: #f8f9fa; padding: 15px;"></pre>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
        function log(message) {
            const output = document.getElementById('debugOutput');
            const timestamp = new Date().toLocaleTimeString();
            output.textContent += `[${timestamp}] ${message}\n`;
            output.scrollTop = output.scrollHeight;
            console.log(message);
        }

        async function testLogin() {
            try {
                log('开始登录测试...');
                const username = document.getElementById('username').value;
                const password = document.getElementById('password').value;
                
                const response = await fetch('/api/admin/login', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json'
                    },
                    body: JSON.stringify({ username, password })
                });
                
                const result = await response.json();
                log(`登录响应: ${JSON.stringify(result, null, 2)}`);
                
                if (response.ok && result.data.token) {
                    localStorage.setItem('adminToken', result.data.token);
                    localStorage.setItem('adminUser', JSON.stringify(result.data.user_info));
                    log('登录成功，Token已保存');
                } else {
                    log('登录失败: ' + result.message);
                }
            } catch (error) {
                log('登录错误: ' + error.message);
            }
        }

        function checkToken() {
            const token = localStorage.getItem('adminToken');
            const user = localStorage.getItem('adminUser');
            log(`Token存在: ${!!token}`);
            log(`用户信息: ${user || '无'}`);
            if (token) {
                log(`Token前20字符: ${token.substring(0, 20)}...`);
            }
        }

        async function testGetClues() {
            try {
                log('测试获取线索列表...');
                const token = localStorage.getItem('adminToken');
                if (!token) {
                    log('错误: 没有Token，请先登录');
                    return;
                }

                const response = await fetch('/api/admin/clues?page=1&page_size=5', {
                    headers: {
                        'Authorization': `Bearer ${token}`
                    }
                });

                log(`响应状态: ${response.status}`);
                const result = await response.json();
                log(`线索列表响应: ${JSON.stringify(result, null, 2)}`);
            } catch (error) {
                log('获取线索列表错误: ' + error.message);
            }
        }

        async function testGetClueDetail(clueId) {
            try {
                log(`测试获取线索详情 (ID: ${clueId})...`);
                const token = localStorage.getItem('adminToken');
                if (!token) {
                    log('错误: 没有Token，请先登录');
                    return;
                }

                const response = await fetch(`/api/admin/clues/${clueId}`, {
                    headers: {
                        'Authorization': `Bearer ${token}`
                    }
                });

                log(`响应状态: ${response.status}`);
                const result = await response.json();
                log(`线索详情响应: ${JSON.stringify(result, null, 2)}`);
            } catch (error) {
                log('获取线索详情错误: ' + error.message);
            }
        }

        async function testGetHistory(clueId) {
            try {
                log(`测试获取处理历史 (ID: ${clueId})...`);
                const token = localStorage.getItem('adminToken');
                if (!token) {
                    log('错误: 没有Token，请先登录');
                    return;
                }

                const response = await fetch(`/api/admin/clues/${clueId}/processing-history`, {
                    headers: {
                        'Authorization': `Bearer ${token}`
                    }
                });

                log(`响应状态: ${response.status}`);
                const result = await response.json();
                log(`处理历史响应: ${JSON.stringify(result, null, 2)}`);
            } catch (error) {
                log('获取处理历史错误: ' + error.message);
            }
        }

        async function testExport() {
            try {
                log('测试导出功能...');
                const token = localStorage.getItem('adminToken');
                if (!token) {
                    log('错误: 没有Token，请先登录');
                    return;
                }

                const params = new URLSearchParams({
                    format: 'excel',
                    clue_ids: '1,2,3'
                });

                const exportUrl = `/api/admin/clues/export?${params}&token=${encodeURIComponent(token)}`;
                log(`导出URL: ${exportUrl}`);

                // 测试请求
                const response = await fetch(exportUrl, {
                    method: 'GET'
                });

                log(`导出响应状态: ${response.status}`);
                log(`响应头 Content-Type: ${response.headers.get('Content-Type')}`);
                
                if (response.ok) {
                    log('导出请求成功');
                    // 实际触发下载
                    const iframe = document.createElement('iframe');
                    iframe.style.display = 'none';
                    iframe.src = exportUrl;
                    document.body.appendChild(iframe);
                    
                    setTimeout(() => {
                        if (iframe.parentNode) {
                            iframe.parentNode.removeChild(iframe);
                        }
                    }, 5000);
                } else {
                    const errorText = await response.text();
                    log(`导出失败: ${errorText}`);
                }
            } catch (error) {
                log('测试导出错误: ' + error.message);
            }
        }

        // 页面加载时检查状态
        document.addEventListener('DOMContentLoaded', function() {
            log('调试页面加载完成');
            checkToken();
        });
    </script>
</body>
</html> 